<template>
    <div>
        <van-nav-bar title="已购买" left-text="返回" left-arrow @click-left="onClickLeft" />
        <van-pull-refresh v-model="refreshingall" @refresh="onRefresh()">
            <van-list v-model="loadingall" :finished="finishedall" finished-text="没有更多了" @load="onLoad()" :immediate-check="false">
                <van-card :price="item.paid_fee" :desc="item.description" :title="item.title"  :thumb="item.cover" v-for="(item, index) in listall" :key="index" @click-thumb="toprodut(item.order_info_id,item.order_info_type)">
                    <template #bottom>
                                <div class="priceBottom" v-if="item.paid == 1" style="color:red">已签收</div>
                                <div class="priceBottom" v-if="item.paid == 2" style="color:red">已购买</div>
                    </template>
                    <template #footer>
                        <van-button round size="small" @click="gokefuchat(item.id)">联系客服</van-button>
                        <van-button round size="small" v-if="item.paid == 2" plain type="danger" @click="confirm()">确认收货</van-button>
                        <van-button round size="small" v-if="item.paid == 1" plain type="danger" @click="toevaluate(item.order_info_id)">去评价</van-button>
                        <van-button round size="small" v-if="item.order_info_type=='Column'" plain type="danger" @click="course()">单个课程</van-button>
                    </template>
                </van-card>
                <van-popup v-model="show" position="bottom"  :style="{ height: '6image.png0%' }">
                    <van-card :price="item.paid_fee" :desc="item.description" :title="item.title"  :thumb="item.cover" v-for="(item, index) in listall" :key="index" @click-thumb="toprodut(item.order_info_id,item.order_info_type)">
                    <template #bottom>
                                <div class="priceBottom" v-if="item.paid == 1" style="color:red">已签收</div>
                                <div class="priceBottom" v-if="item.paid == 2" style="color:red">已购买</div>
                    </template>
                    <template #footer>
                        <van-button round size="small" @click="gokefuchat(item.id)">联系客服</van-button>
                        <van-button round size="small" v-if="item.paid == 2" plain type="danger" @click="confirm()">确认收货</van-button>
                        <van-button round size="small" v-if="item.paid == 1" plain type="danger" @click="toevaluate(item.order_info_id)">去评价</van-button>
                        <van-button round size="small" plain type="danger" @click="course()">单个课程</van-button>
                    </template>
                </van-card>
                </van-popup>
            </van-list>
        </van-pull-refresh>
    </div>
</template>
<script>
export default {
    data() {
        return {
            orderlistall: '',
            loadingall: true,
            finishedall: false,
            refreshingall: false,
            totalall: '',
            listall:[],
            pageall:1,
            show:false
        };
    },
    methods: {
        course(show){
            this.show=true
        },
        toprodut(id,type){
            if(type=="Knowledge"){
                this.$router.push({name:'videocontent',query:{id,columnid:'order'}})
            }else{
                this.$router.push({name:'product',query:{id}})
            }
        },
        gokefuchat(orderid) {
            this.$router.push({ name: "kefuchat",query:{orderid}});
        },
        onClickLeft() {
            this.$router.back();
        },
        toevaluate(id) {
            this.$router.push({ name: 'evaluate' ,query:{id}});
        },
        async getOrderList(paid) {
            let query = {
                paid,
                page: 1,
                limit: 4,
                keyword: ''
            };
            query.page = this.pageall;
            let resall = await this.$frontaxios.post(this.$front.getOrderList, query);
            console.log(resall);
            if (resall.code == 1) {
                this.loadingall = true;
                this.orderlistall = resall.data.orderlist;
                this.totalall = resall.data.total;
            } else {
                console.log('没有获取到全部的订单');
            }
        },
        async onLoad() {
            if (this.refreshingall) {
                this.listall = [];
                this.refreshingall = false;
            }
            await this.getOrderList(12);
            this.listall.push(...this.orderlistall);
            this.pageall++;
            this.loadingall = false; //不加载了，滚动底会变为true
            if (this.listall.length >= this.totalall) {
                this.finishedall = true; //数据全部加载完设为true
            }
        },
        onRefresh() {
            // 清空列表数据
            this.finishedall = false;

            // 重新加载数据
            // 将 loadingall 设置为 true，表示处于加载状态
            this.loadingall = true;
            this.pageall = 1;
            this.onLoad();
            this.$toast.success('刷新成功');
        }
    },
    created() {
       this.onLoad();
    }
};
</script>
<style lang='less' scoped>
</style>
